<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<link rel="stylesheet" type="text/css" href="../../js/lib/theme-chalk/index.css" />

		<link rel="stylesheet" type="text/css" href="../../css/my_commont.css" />
		<link rel="stylesheet" type="text/css" href="index.css" />

		<script src="../../common/utilCookie.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../common/author.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../js/vue.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../js/jquery.js" type="text/javascript" charset="utf-8"></script>
		<!-- 引入组件库 -->
		<script src="../../js/lib/index.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../js/axios.min.js"></script>
		<script src="../../common/judegetEmpty.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../js/config.js" type="text/javascript" charset="utf-8"></script>
		<script src="../../js/aixos-init.js" type="text/javascript" charset="utf-8"></script>
		<script src="index.js" type="text/javascript" charset="utf-8"></script>

		<title>商品列表</title>
		<style type="text/css">
			[v-cloak] {
				display: none;
			}
		</style>
	</head>
	<body>
		<div id="goodListApp" v-cloak>
			<div class="contaner" v-loading.fullscreen.lock="fullscreenLoading">
				<div class="section-header">
					商品 - - 商品列表
				</div>
				<hr class="hr-style" />

				<div class="good-content">

					<el-tabs v-model="activeName" type="card" @tab-click="handleClick">
						<el-tab-pane label="商品列表" name="first">
							<div class="search-good">
								<el-input placeholder="请输入商品名" v-model="searchGood" class="search-good-input">
									<el-button slot="append" @click="clickSearchGood">搜索</el-button>
								</el-input>
							</div>
							<!--  商品表格 -->
							<div class="good-table">
								<el-table :data="tableData" border style="width: 100%">

									<el-table-column prop="uid" label="商品Id">
									</el-table-column>
									<el-table-column prop="releaseDate" label="商品创建时间">
									</el-table-column>
									<el-table-column label="商品信息">
										<template slot-scope="scope">
											<div class="good-table-info">

												<el-image style="width: 60px; height: 60px" :src="scope.row.cover" fit="fill"></el-image>
												<p class="good-table-info-text">商品名称:{{scope.row.name}}</p>

											</div>
										</template>
									</el-table-column>
									<el-table-column prop="newPrice" label="价格(¥)">
									</el-table-column>
									<el-table-column prop="inventory" label="库存">
									</el-table-column>
									<el-table-column label="商品类型">
										<template slot-scope="scope">
											<p v-if="scope.row.faddishState == 0">
												好物钜惠
												<el-button type="text" size="small" @click="handleCancelGoodClick(scope.row,2)">取消好物钜惠</el-button>

											</p>
											<p v-if="scope.row.isHot == 0">
												热销排行
												<el-button type="text" size="small" @click="handleCancelGoodClick(scope.row,7)">取消热销排行</el-button>
											</p>
											<p v-if="scope.row.isNew == 0">
												秀品好货
												<el-button type="text" size="small" @click="handleCancelGoodClick(scope.row,4)">取消秀品好货</el-button>

											</p>
											<p v-if="scope.row.secondsKill == 0">
												限时打折
												<el-button type="text" size="small" @click="handleCancelGoodClick(scope.row,3)">取消限时特价</el-button>

											</p>
											<p v-if="scope.row.isRecommend == 0">
												精挑细选
												<el-button type="text" size="small" @click="handleCancelGoodClick(scope.row,5)">取消精挑细选</el-button>

											</p>
											<p v-if="scope.row.isRights == 0">
												权益商品
												<el-button type="text" size="small" @click="handleCancelGoodClick(scope.row,6)">取消权益商品</el-button>
											</p>
										</template>
									</el-table-column>
									<el-table-column label="活动类型" width="150">
										<template slot-scope="scope">
											<div style="display: inline-block;" v-for="item in scope.row.logos">
												<span>{{item.name}}</span>
												<el-button type="text" size="small" @click="handleActionClick(item)">删除?</el-button>
											</div>

										</template>
									</el-table-column>
									<el-table-column label="所属店铺" width="150">
										<template slot-scope="scope">
											<p> 店铺名称：{{scope.row.shop.name}}</p>
											<p v-if="scope.row.shop.isDealer==1">归属： 入驻店铺</p>
											<p v-else> 归属：自营店铺</p>

										</template>
									</el-table-column>
									<el-table-column prop="status" label="审核状态">
										<template slot-scope="scope">
											<p class="good-stauts">{{scope.row.status}}</p>
										</template>
									</el-table-column>
									<el-table-column label="操作" width="200">
										<template slot-scope="scope">
											<div v-if="scope.row.showState == 0">
												<div>
													<el-button type="text" size="small" @click="handeBlackGood(scope.row)">封禁商品</el-button>
												</div>
												<el-button type="text" size="small" @click="handleSetGoodClick(scope.row,1)">设置为首页活动商品</el-button>
												<el-button type="text" size="small" @click="handleSetGoodClick(scope.row,2)">设置为好物钜惠</el-button>
												<el-button type="text" size="small" @click="handleSetGoodClick(scope.row,3)">设置为限时特价</el-button>
												<el-button type="text" size="small" @click="handleSetGoodClick(scope.row,4)">设置为秀品好货</el-button>
												<el-button type="text" size="small" @click="handleSetGoodClick(scope.row,5)">设置为精挑细选</el-button>
												<el-button type="text" size="small" @click="handleSetGoodClick(scope.row,6)">设置为掌柜权益</el-button>
												<el-button type="text" size="small" @click="handleSetGoodClick(scope.row,7)">设置为热销排行</el-button>
											</div>
											<div v-else>
												<el-button type="text" size="small" @click="handleRelieveGood(scope.row)">解封商品</el-button>
											</div>


										</template>
									</el-table-column>
								</el-table>
								<div class="good-footer-style">
									<el-pagination @current-change="handleCurrentChange" :current-page="currentPage" layout="total,prev,pager,next,jumper"
									 :page-size="10" :total="totalSize">
									</el-pagination>
								</div>
							</div>
				</div>
				</el-tab-pane>
				</el-tabs>

			</div>
			<el-dialog title="限时特价结束时间" :visible.sync="dialogEditFormVisible" width="600px">
				<el-form :model="editFrom" label-width="80px">
					<el-form-item label="活动时间">
						<el-col :span="11">
							<el-date-picker value-format="yyyy-MM-dd" type="date" placeholder="选择日期" v-model="editFrom.dateStr" style="width: 100%;"></el-date-picker>
						</el-col>
						<el-col class="line" :span="2">-</el-col>
						<el-col :span="11">
							<el-time-picker value-format="HH:mm:ss" placeholder="选择时间" v-model="editFrom.timeStr" style="width: 100%;"></el-time-picker>
						</el-col>
					</el-form-item>
				</el-form>
				<div slot="footer" class="dialog-footer">
					<el-button @click="dialogEditFormVisible = false">取 消</el-button>
					<el-button type="primary" @click="configSetActionTime">确 定</el-button>
				</div>
			</el-dialog>
			<el-dialog title="请设置分类" :visible.sync="dialogEditActionFormVisible" width="400px">
				<el-form :model="editFrom">
					<el-form-item label="请选择分类">
						<el-select v-model="editFrom.logoId" placeholder="请选择">
							<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
							</el-option>
						</el-select>
					</el-form-item>
				</el-form>
				<div slot="footer" class="dialog-footer">
					<el-button @click="dialogEditActionFormVisible = false">取 消</el-button>
					<el-button type="primary" @click="configSetActionHome">确 定</el-button>
				</div>
			</el-dialog>

		</div>
		</div>
	</body>
</html>
